<layout name='Layout/layout_main_page' />
<script type="text/javascript">
    $(function() {
        $("#tree1").ligerTree({
            data: {$json_tree},
            checkbox: false,
            slide: false,
            nodeWidth: 120,
            onSelect: function(node)
            {
                var keyword = $('#keyword').val();
                $('#dept_id').val(node.data.id);
                get_user(keyword);
            }
        });

        // alert("{$dept_id}");     
    });
    function get_user(keyword) {
        var dept_id = $('#dept_id').val();
        sendAjax("{:U('user/select_user')}", "dept_id=" + dept_id + "&keyword=" + keyword, function(data) {
            //alert(data);	
            if (data != null) {
                showdata(data);
            } else {
                $('#show_dept_list').html('');
            }
        });

    }

    function select_search() {
        var keyword = $('#keyword').val();
        get_user(keyword);
    }

    function showdata(result) {
        $('#show_dept_list').html('');
        $.each(result, function(i, val) {
            var st = val.status == 1 ? '启用' : '禁用';
            $('#show_dept_list').append('<tr class="color_class" onclick=chose_user(this.id,"'+val.id+'","'+val.emp_name+'","'+val.dept_id+'") id="D' + val.id + '"></tr>');
            $('#D' + val.id).append('<td>' + val.emp_no + '</td><td>' + val.emp_name + '</td><td>' + st + '</td>');
        });

    }

    function chose_user(sid,user_id,user_name,dept_id){
        $(".color_class").removeClass("active");
	$('#'+sid).addClass("active");
        $("#salesman").val(user_name);
         $("#user_id").val(user_id);
         $("#dept_id").val(dept_id);
    }
    function save(){
		if ($("#salesman").val().length > 0) {
			$("#salesman", parent.document).val($("#salesman").val());
			$("#user_id", parent.document).val($("#user_id").val());
                        $("#dept_id", parent.document).val($("#dept_id").val());
                        $('.l-dialog-btn-inner',parent.document).click();
		} else {
			alert("请选择员工");
		}
		
    }
</script>
<div class="row-fluid title">
    <span>用户管理</span>
    <div class="input-append right">
        <input type="text"  id="keyword" name="keyword" value="{$keyword}" />
        <input type="hidden" value="" id="dept_id" name="dept_id" />
        <input type="hidden" value="" id="salesman" name="salesman" />
        <input type="hidden" value="" id="user_id" name="user_id" />
        <a class="btn" type="button" onclick="select_search();"><i class="icon-search"></i>
        </a>&nbsp;
       <input type="button" class="btn" name="btn_select_dept" value="确定" onclick="save();">
    </div>
</div>
<div style="width: 200px; height: 300px; margin: 10px; float: left; border: 1px solid #ccc; overflow: auto;">
    <ul id="tree1" style="margin-top:3px;">
</div>
<div style="width: 400px; height: 300px; margin: 10px; float:right; border: 1px solid #ccc; overflow: auto;">
    <table class="table table-bordered">
        <thead>
            <tr>
                <th>员工编号</th>
                <th>姓名</th>
                <th>状态</th>
            </tr>
        </thead>
        <tbody id="show_dept_list">
        <volist name="list" id="data">
            <tr id="D{$data.id}" class="color_class" onclick=chose_user(this.id,'{$data.id}','{$data.emp_name}','{$data.dept_id}');>
                <td>{$data.emp_no}</td>
                <td>{$data.emp_name}</td>
                <td>{$data.status|status}</td>
        </volist>
        </tbody>

    </table>
</div>